import * as React from 'react';
import { Button, Toast, List, NoticeBar, WhiteSpace, WingBlank, InputItem } from '@ant-design/react-native';
import { Text, View } from 'react-native';
import { Form, Input } from '../../components/form';
import { API } from "../../util/request";

class Login extends React.Component {
    state = {
        mobile: '',
        password: ''
    };

    goHome = () => {
        this.props.history.push({
            pathname: '/',
            state: {}
        })
    }

    submitForm = async () => {
        API.post("/weike/admin/login", { 'mobile': this.state.mobile, 'pwd': this.state.password }).then(json =>
            Toast.success('登录成功', 1, () => {
                global.userInfo = json.data;
                global.storage.save({
                    key: 'loginState',
                    data: global.userInfo,
                    expires: null
                });
                this.goHome();
            }));
    };

    render() {
        return (<View>
            <List renderHeader={() => '登陆湖南汇富康达'}>
                <NoticeBar marqueeProps={{ loop: true }} mode="closable">
                    Notice: 欢迎来到湖南汇富康达智能在线OA办公系统，这里的功能慢慢完善中...
                </NoticeBar>
                <WhiteSpace size="xl" />
                <Form
                    ref={ref => (this.form = ref)}
                    onSubmit={() => this.submitForm()}>
                    <Input type='text' placeholder='请输入工号' rule='required' error='账号不能为空' value={this.state.mobile} onChange={value => this.setState({ mobile: value.trim() })}>账号：</Input>
                    <WhiteSpace size="xl" />
                    <Input type='password' placeholder='***' rule='required' error='密码不能为空' value={this.state.password} onChange={value => this.setState({ password: value.trim() })}>密码：</Input>
                    <WhiteSpace size="xl" />
                </Form>
                <WingBlank>
                    <Button onPress={() => this.form.validate()} type="primary">登录</Button>
                </WingBlank>
                <WhiteSpace size="xl" />
            </List>
        </View>);
    }
}

export { Login };